<template>
    <div>
      
       <Row :gutter="10">
          <Card>
            <Row>
              <el-form :inline="true" :model="filters">
                <!-- <el-button plain >应用注册</el-button> -->
                  <el-form-item style="float:right">
                    <el-button type="primary" v-on:click="getTaskList">查询</el-button>
                  </el-form-item>
                  <el-form-item style="float:right">
                    <el-input v-model="filters.marketName"  placeholder="市场名称"></el-input>
                  </el-form-item>
                  <el-form-item style="float:right">
                    <el-input v-model="filters.appName"  placeholder="应用名称"></el-input>
                  </el-form-item>
              </el-form>
            </Row>
          </Card>
          <Card>           
          <el-row class="tac">
          <el-col :span="20" >
            <el-table :data="taskData" highlight-current-row v-loading="listLoading" style="width: 100%"  >
              <el-table-column width="30"  >
              </el-table-column>
              <el-table-column prop="appName"  label="应用名称"  >
              </el-table-column>
              <el-table-column prop="version" label="应用版本" >
              </el-table-column>
              <el-table-column prop="versionType" label="版本类型" :formatter="formatVersion">
              </el-table-column>
              <el-table-column prop="marketName" label="市场名称">
              </el-table-column>
              <el-table-column prop="status" label="推送状态" :formatter="formatSyncStatus"></el-table-column>
              <el-table-column prop="createDate" label="创建时间" :formatter="formatStartDate" >
              </el-table-column>
              <el-table-column prop="updateDate" label="结束时间" :formatter="formatEndDate" >
              </el-table-column>
              <el-table-column fixed="right" label="操作" width="250">
              <template slot-scope="scope">
              <el-button v-if="scope.row.status === 'pushFailure'"  type="text" size="small">重试</el-button>
              </template>
              </el-table-column>
            </el-table>
          </el-col>              
          <el-col :span="24" class="toolbar">
            <el-pagination layout="total, prev, pager, next, jumper" @current-change="handleCurrentPageChange"
                            :current-page="pageNum" :page-size="pageSize" :total="total">
            </el-pagination>
          </el-col>
          </el-row>
          </Card>
        </Row>
    </div>
</template>

<script>
import {taskList } from '../../api/api';
import util from '../api/util'

export default {
  // name: "appmarket_index",
  data() {
    return {
      filters: {
        appName: '',
        marketName:''
      },
      total: 0,
      pageNum: 1,
      pageSize:5,
      // taskData:[],
      taskData: [],
      listLoading: false,
      formLabelWidth: '120px'

    };
  },
  methods: {
    handleCurrentPageChange: function (pageNum) {// 翻页动作
        this.pageNum = pageNum;
        this.getTaskList();// 翻页后刷新页面数据
    },
    formatSyncStatus: function (row, column) {
				return row.status == 'waiting' ? '等待推送' : row.status == 'pushing' ? '推送中' : row.status == 'pushSuccess' ? '推送成功':'推送失败';
    },
    formatStartDate: function (row, column) {
      return row.startDate = (!row.startDate || row.startDate == '') ? '' : util.formatDate.format(new Date(row.startDate), 'yyyy-MM-dd hh:mm:ss');
    },
    formatEndDate: function (row, column) {
      return row.endDate = (!row.endDate || row.endDate == '') ? '' : util.formatDate.format(new Date(row.endDate), 'yyyy-MM-dd hh:mm:ss');
    },
    formatVersion: function (row, column) {
				return row.versionType == 1 ? 'Web' : row.versionType == 2 ? 'IOS' : row.versionType == 3 ? 'Android':'';
      },
    
    getTaskList() {
      let params = {
        pageNum: this.pageNum,
        pageSize:this.pageSize,
        marketName: this.filters.marketName,
        appName: this.filters.appName
      };
      this.listLoading = true;
      taskList(params).then(function(result){
        this.taskData = result.data.list;
        // console.log("===============================================")
        this.pageNum = result.data.pageNum;
        this.pageSize = result.data.pageSize;
        this.total = result.data.total;
        this.listLoading = false;
      }.bind(this)).catch(function (error) {
        this.listLoading = false;
        console.log(error);
      }.bind(this));
    },
    
  },
  computed: {
    
  },
  created() {
  },
  mounted(){
    this.getTaskList();
  }
};
</script>
